<!DOCTYPE html>
<!--
Copyright 2013 The Polymer Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<html>
  <head>
    <title>Native CustomElements with MDV</title>
    <meta charset="UTF-8">
    <script src="../../MDV/mdv.js"></script>
  </head>
  <body>
    <x-foo id="xfoo1">XFoo One</x-foo>
    
    <hr>
    
    <script>
      
      function registerXFoo(d) {
        d.webkitRegister('x-foo', {
          prototype: Object.create(HTMLElement.prototype, {
            isXFoo: {
              value: true
            }
          })
        });
      }
      
      registerXFoo(document);
      
      var doc = document.implementation.createHTMLDocument('foo');
      // registration is per document!
      registerXFoo(doc);
      
      doc.body.innerHTML = '<x-foo id="xfoo2">XFoo Two</x-foo>';
      document.body.appendChild(doc.body.firstChild);
      
      Array.prototype.forEach.call(document.querySelectorAll('x-foo'), function(node) {
        console.log('upgraded', node.isXFoo);
      });
    </script>
  </body>
</html>
